// 该文件用于创建 Vuex 中最为核心的store

// 引入 vue 用于使用Vuex
import Vue from "vue";
// 引入Vuex
import Vuex from "vuex";
// 使用 Vuex 插件
Vue.use(Vuex);

// 准备 actions --- 用于响应组件中的动作
const actions = {
  // 在actions中的逻辑代码可以实现多组件复用
  /* jia(context, value) {
    console.log("actions中的jia被调用了", context, value);
    // 调用mutations中的JIA方法
    context.commit("JIA", value);
  },
  jian(context, value) {
    context.commit("JIAN", value);
  }, */
  jiaOdd(context, value) {
    console.log(context);
    if (context.state.sum % 2) {
      context.commit("JIA", value);
      // 若在此处直接操作state中的数据，Vuex开发者工具将不会捕获到此次操作
      // context.state.sum += value;
    }
    /* console.log("处理了一些事情———jiaOdd");
    // 可以通过 context 继续调用 dispatch 触发其他 action 
    context.dispatch("demo1", value); */
  },
  /* demo1(context, value) {
    console.log("处理了一些事情———demo1");
    context.dispatch("demo2", value);
  },
  demo2(context, value) {
    console.log("处理了一些事情———demo2");
    if (context.state.sum % 2) {
      context.commit("JIA", value);
    }
  }, */
  jiaWait(state, value) {
    setTimeout(() => {
      state.commit("JIA", value);
    }, 500);
  },
};
// 准备 mutations --- 用于操作数据(state)
const mutations = {
  JIA(state, value) {
    console.log("mutations中的JIA被调用了", state, value);
    state.sum += value;
  },
  JIAN(state, vale) {
    state.sum -= vale;
  },
};
// 准备 state --- 用于存储数据
const state = {
  sum: 0, // 当前的求和
  school:"尚硅谷",
  subject:"前端"
};
// 准备 getters --- 用于将state中的数据进行加工
const getters = {
  bigSum(state) {
    return state.sum * 10;
  },
};

// 创建并暴露 store
export default new Vuex.Store({
  actions,
  mutations,
  state,
  getters,
});
